<template>
  <div>
    <el-input
      v-model="value"
      placeholder="搜索"
      prefix-icon="el-icon-search"
    ></el-input>
  </div>
</template>

<script>
export default {
  props: {
    value: {
      type: String,
      default: "",
    },
  },
};
</script>
<style lang="less" scoped>
.el-input {
  width: 200px;
  height: 30px;
  /deep/input {
    outline: none;
    background-color: rgb(226, 226, 226);
    &::-webkit-input-placeholder {
      color: #888;
    }
  }
  /deep/.el-input__inner {
    height: 100%;
    &:focus {
      border-color: #ccc;
    }
  }
  /deep/.el-input__prefix {
    .el-input__icon::before {
      position: absolute;
      top: -5px;
      left: 10px;
      color: #888;
    }
  }
}
</style>